<template>
    <lay-tab type="brief" v-model="current7" tabPosition="top" activeBarTransition="true"
        style="height: 500px;margin-top: 20px;">
        <lay-tab-item title="选项一" id="1">
            <div style="padding:20px">选项一</div>
        </lay-tab-item>
        <lay-tab-item title="选项二" id="2">
            <div style="padding:20px">选项二</div>
        </lay-tab-item>
        <lay-tab-item title="选项三" id="3">
            <div style="padding:20px">选项三</div>
        </lay-tab-item>
        <lay-tab-item title="选项四" id="4">
            <div style="padding:20px">选项四</div>
        </lay-tab-item>
    </lay-tab>
</template>

<script setup>
import { ref } from 'vue';
const current7 = ref("1");

</script>

<style scoped>
.corner-mark {
    height: 20px;
    width: 20px;
    display: inline-block;
    padding: 0;
    color: #fff;
    line-height: 20px;
    font-size: 10px;
    background-color: #f5222d;
    border-radius: 50%;
}
</style>
